<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet"
	href="${pageContext.request.contextPath }/css/style.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath }/css/bootstrap.min.css">
<script src="${pageContext.request.contextPath }/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
<script type="text/javascript">
	function login() {
		var xhr = new XMLHttpRequest();
		var username = document.getElementById("username").value;
		var password = document.getElementById("password").value;
		if(username =="" || password == ""){
			var show = "<font color='red'>用户名或密码不能为空！</font>";
			document.getElementById("info").innerHTML = show;
		}else{
			xhr.onreadystatechange = function() {
				if (xhr.readyState == 4 && xhr.status == 200) {
					var result = xhr.responseText;
					var back = JSON.parse(result);
					if (back.status) {
						window.location.href = "${pageContext.request.contextPath}/index";
					} else {
						var show = "<font color='red'>用户名或密码错误！</font>";
						document.getElementById("info").innerHTML = show;
					}
				}
			}
		}
		xhr.open("post", "client/account", true);
		xhr.setRequestHeader("Content-type",
				"application/x-www-form-urlencoded");
		xhr.send("action=login&" + "username=" + username + "&password="
				+ password);
	}
</script>
<title>Login</title>
</head>
<body>
	<div class="container">
		<div class="login-container">
			<h2 class="login-title">Login</h2>

			<div class="form-group">
				<label class="sr-only">Tel</label> <input type="text"
					name="username" placeholder="Username..."
					class="form-username form-control" id="username">
			</div>
			<div class="form-group">
				<label class="sr-only">Password</label> <input type="password"
					name="password" placeholder="Password..."
					class="form-password form-control" id="password">
			</div>
			<span id="info"></span>
			<button type="button" class="btn btn-primary login-btn" onclick="login()">Login</button>
			<a href="${pageContext.request.contextPath }/register.jsp"
				class="btn gray-btn">Register</a>
		</div>
	</div>
	</div>
</body>
</html>